<!DOCTYPE html>
<html>
<head>
	<meta charset="UTF-8">
	<title>修改用户</title>
	<style>
		
		#modify {
			margin: 20px;
			padding: 20px;
			border: 1px solid #ccc;
			border-radius: 5px;
			background-color: #f9f9f9;
			width: 950px;
		}
		label {
			display: block;
			margin-bottom: 10px;
			font-weight: bold;
		}
		input[type="text"], select {
			display: block;
			margin-bottom: 10px;
			padding: 5px;
			border: 1px solid #ccc;
			border-radius: 3px;
			width: 100%;
			box-sizing: border-box;
		}
		input[type="button"] {
			background-color: #fbc2eb;
			color: white;
			padding: 10px 20px;
			border: none;
			border-radius: 3px;
			cursor: pointer;
		}
		input[type="button"]:hover {
			background-color: rgb(255, 128, 192);
		}
	</style>
	<script type="text/javascript" src="js/vue-2.6.10.js"></script>
	<script type="text/javascript" src="js/axios.js"></script>
</head>
<body>
	<div id="modify">
		<input type="hidden" v-model='user.uName' name="uName">
		<label for="uName">姓名：</label>
		<input type="text" id="uName" v-model='user.uName' name="uName" required>

		<label for="uPhone">电话：</label>
		<input type="text" id="uPhone" v-model='user.uPhone' name="uPhone" required>

		<label for="uSex">性别：</label>
		<select id="uSex" v-model='user.uSex' name="uSex" required>
			<option value="男">男</option>
			<option value="女">女</option>
		</select>

		<input type="button" value="保存" @click="updateuser">
	</div>
	<script type="text/javascript">
	 function parseUrlParams() {
 	    var url = window.location.href;
 	    var paramString = url.split('?')[1];
 	    var paramPairs = paramString.split('&');
 	    var params = {};

 	    paramPairs.reduce(function(params, pair) {
 	        var parts = pair.split('=');
 	        var key = parts[0];
 	        var value = decodeURIComponent(parts[1] || '');

 	        if (params[key]) {
 	            params[key].push(value);
 	        } else {
 	            params[key] = [value];
 	        }

 	        return params;
 	    }, params);

 	    return params;
 	}
	 
	 
  	  let vue = new Vue({
  		  el:'#modify',
  		  data:{
  			  user:{
  				  
  				  uName:'',
  				  uPhone:'',
  				  uAddress:'',
  				  uName:'',
  				  
  				  
  			  }
  		  },
  		  
  		  created(){
  			  params = parseUrlParams();
  			  axios.get('/OrderServert/user.do/'+params.id[0]).then(
  				function(res_obj){
  					vue.user = res_obj.data.data;
  				}	  
  			  ).catch(
						function(error_obj){
							alert("数据加载异常！！！");
						}
				)
  		  },
  		  
  		  methods: {
  			  updateuser: function(){
  				param = "uId="+vue.user.uId+"&uName="+vue.user.uName +"&uPhone="+vue.user.uPhone+"&uSex="+vue.user.uSex;
  				axios.put('/OrderServert/user.do?'+param).then(
	  				function(res_obj){
	  					
	  					window.location.href="user.html";
	  				}	  
	  			  ).catch(
							function(error_obj){
								alert("数据加载异常！！！");
							}
					)
  			  }
  			  
  		  }
  	  });
  
  </script>
</body>
</html>